import { Story } from '@storybook/react';
import { Route, Routes } from 'react-router';

import { RoutesConfig } from '../../../app/config/routes';
import { withProviders } from '../../../shared/utils/storybook';
import { createMockRouterProps } from '../../../tests/utils/rendering';
import { Edit{{ pascalCase name }} } from './edit{{ pascalCase name }}.component';

const routePath = ['{{ camelCase name }}', 'edit'];
const defaultItemId = 'test-id';

const Template: Story = () => {
  return (
    <Routes>
      <Route path={RoutesConfig.getLocalePath(routePath)} element={<Edit{{ pascalCase name }} />} />
    </Routes>
  );
};

export default {
  title: '{{ pascalCase name }} / Edit{{ pascalCase name }}',
  component: Edit{{ pascalCase name }},
};

export const Default = Template.bind({});

Default.decorators = [withProviders({ routerProps: createMockRouterProps(routePath, { id: defaultItemId }) })];
